<template>
  <el-select
    v-model="domain"
    filterable
    remote
    reserve-keyword
    placeholder="输入域名搜索网站"
    :remote-method="remoteSearchWebsite"
    :loading="remoteSearchWebsite_loading"
  >
    <el-option
      v-for="item in website_options"
      :key="item.id"
      :label="item.domain"
      :value="item.domain"
    />
  </el-select>
</template>

<script>
import { Get as GetWebsite } from '@/api/erp/elicink/website'
import qs from 'qs'
export default {
  props: {
    domain: {
      type: String,
      default: () => {
        return ''
      }
    }
  },
  data() {
    return {
      website_options: [],
      remoteSearchWebsite_loading: false
    }
  },
  methods: {
    setWebsiteOptions(v) {
      v.forEach(website => {
        GetWebsite(website).then(response => {
          this.website_options.push(response.data)
        })
      })
    },
    remoteSearchWebsite(query) {
      if (query !== '') {
        this.remoteSearchWebsite_loading = true
        GetWebsite(null, qs.stringify({
          kw: query,
          pagesize: 5,
          page: 1
        })).then(response => {
          this.website_options = response.data.data
          this.remoteSearchWebsite_loading = false
        })
      } else {
        this.website_options = []
        this.remoteSearchWebsite_loading = false
      }
    }
  }
}
</script>

